  <script>
  $(function() {
    $( "#tabs" ).tabs();
  });
  </script>
 
<div id="tabs">
  <ul>
  	<li><a href="#tabs-0">Item Details</a></li>
    <li><a href="#tabs-1">Available Colors</a></li>
    <li><a href="#tabs-2">Item Sections</a></li>
    <li><a href="#tabs-3">Section Colors</a></li>
    <li><a href="#tabs-4">Item View</a></li>
  </ul>
  <div id="tabs-0">
  	 <p>
  	 
  	 <hr>

<br>
<?php 
include CORE_DIR."manage/default.php";
?>

<br><br>

<p id="addviewform"></p> 	 
  	 
  	 
  </div>
  <div id="tabs-1">
  	 <p id="viewavailablecolorsbyitem"></p>
   		
  </div>
  <div id="tabs-2">
    <p id="viewaitemsections"></p>
  </div>
  <div id="tabs-3">
   <p id="viewsectioncolors"></p>
    </div>
    <div id="tabs-4">
   <p id="viewitemimages">
   <form action = "{URL}/items/saveview/{ID}">

   <?php 
   	/**
 	 <p>
   			<a href="javascript:void(0)" onclick="addAnother('mainviewdiv','mainviewp')">Add Another</a>
   		 	<input type="submit" value="Upload"/>
   	</p>*/
   	?>
   </form>
   <div>
   
   		<table>
   			<?php forEach($CUSTOMREFERENCE['item_view_list'] as $record){ 
   			?>
   			<tr><td colspan="4"><hr><h1><?=humanize($record['name'])?></h1><hr></td></tr>
   			<tr>
   				<td valign="top" >
   					<img src="<?=$record['image_path']?>" width="500" height="500"/>
   				</td>
   				<td width="5%"></td>
   				<td  width="50%" valign="top" >
   					<form  METHOD="post" id="item_section_view_coordinates_form_<?=$record['id']?>">
	   					<input type="hidden" name="item_id" value="{ID}">
	   					<input type="hidden" name="item_view_id" value="<?=$record['id']?>">
	   					<p>Section : 
	   						<select id="sectionview_<?=$record['id']?>" name="item_section_id" style="width:200px">
	   						</select><br>
	   						Coordinates<br>
	   						<textarea name="coordinates" cols="60" rows="4"></textarea>
	   					</p>
	   					
	   					<p><input type="button" onclick= "return addsectioncoordinates(<?=$record['id']?>);" value="Add"/></p>
	   					
   					</form>
   					<p id= "item_view_section_coordinates_<?=$record['id']?>"></p>
   				</td>
   			</tr>
   			<?php }?>
   		</table>
   		<div id="testingonlydiv"></div>
   	</div>
   </p>
    </div>
</div>
  	 <script type="text/javascript">
  	 //$(document).ready(function(){
		 loadpage('viewavailablecolorsbyitem','{URL}/item_color/listall_a' );
		 loadpage('viewaitemsections','{URL}/item_section/byitem/{ID}');
		 loadpage('viewsectioncolors','{URL}/item_section_color/byfield/item_id/{ID}');
		//TEMPORARY HIDE THIS 
		// loadpage('addviewform','{URL}/item_view/add');
		// loadpage('item_view_section_coordinates_1','{URL}/item_view_section_coordinates/byitem/{ID}');
		 loadpage('item_view_section_coordinates_' + {ID},'{URL}/item_view_section_coordinates/byfield_a/item_view_id/' + {ID});
		  	
		 <?php forEach($CUSTOMREFERENCE['item_view_list'] as $record){ ?>
		 	loadOptionSelect("sectionview_" + <?=$record['id']?> , "{URL}/item_section/loadoptions/item_id/{ID}");
		 	loadpage('item_view_section_coordinates_' +  <?=$record['id']?>,'{URL}/item_view_section_coordinates/byfield_a/item_view_id/' +  <?=$record['id']?>);
			 
		 <?php }?>
  //	 });

  	 function getFormData(){

 		return ;
  	 }

  	 function addsectioncoordinates( viewid){
  			    $.ajax({
			      url: "{URL}/item_view_section_coordinates/ajaxinsert",
			      type: "post",
			      //data: values,
			       data: $('#item_section_view_coordinates_form_' + viewid).serialize(),
			      success: function(data){
				      loadpage('item_view_section_coordinates_' + viewid,'{URL}/item_view_section_coordinates/byfield_a/item_view_id/' + viewid);
				      $('#item_section_view_coordinates_form')[0].reset();
			      },
			      error:function(data){
			          alert("failure");
			      }   
			    }); 
		
  	 }
  	 </script>
